{extend name="common/base" /}
{block name="body"} 
	<!-- main -->
	<main>
		<!-- 收藏 -->
		<div class="container">
			<div class="layui-tab collect-goods top-tab">
				<ul class="layui-tab-title">
					<li class="layui-this">
						<a href="/collect.html">My Collection</a>
					</li>
					<li><a href="/shopping-cart.html">Shopping Cart</a></li>
				</ul>
				<ul class="layui-row collect-goods-item layui-col-space25">
					{if count($list)} 
						{volist name="list" id="vo"} 
							<li class="layui-col-md3 layui-col-xs6 collect_li">
								<div>
									<a href="/goods/{$vo.gcode}">
										<img src="{$vo.goods.cover}" />
										<p><span>{$vo.goods.name}</span>
											<img src="__ROOT__/static/images/part2-go.png" alt="" />
										</p>

									</a>
									<div class="collect-oparation">
										<p class="cancel-collect" data-id="{$vo.id}">
											<img src="__ROOT__/static/images/cancel-heart.png" alt="">
											<span>cancel</span>
										</p>
										<p class="collect-to-cart" data-id="{$vo.id}" data-ghash="{$vo.ghash}">
											<img src="__ROOT__/static/images/collect-shopping-cart.png" alt="">
											<span>add to cart</span>
										</p>
									</div>
									<div class="collect-purchase" data-id="{$vo.id}" data-ghash="{$vo.ghash}">
										<a href="javascript:;">
											Purchase
										</a>
									</div>
								</div>
							</li>
								
						{/volist}
					{/if}
				</ul>
			</div>
		</div>
	</main>
{/block}

{block name="js"} 
<script>
    $('.cancel-collect').on('click', function () {
		var that = $(this)
            ajaxRequest('/cancel-collect', {id:$(this).data('id')}, 'POST', this, function (response) {
				
                layer.msg('Cancel Success', {icon: 1, time: 2000}, function() {
					that.parents('.collect_li').remove();
                });
            });
        });

	  // Add to cart
	  $('.collect-to-cart').click(function () {
            const ghash = $(this).data('ghash');
            if (!ghash) {
                layer.msg('Please select a valid specification combination!', { icon: 2 });
                return;
            }

            const data = {
                ghash: ghash,
                number: 1, // Default quantity is 1
            };

            // Send AJAX request
            ajaxRequest('/add_cart', data, 'POST', this, function (response) {
          
                if (response.code == 1) {
                    layer.msg('Successfully Added To The Shopping Cart', { icon: 1 });
                } else {
                    layer.msg(response.message || 'Operation Failed!', { icon: 2 });
                }
            });
        
        });

		//购买
		$('.collect-purchase').click(function () {
			const ghash = $(this).data('ghash');
            if (!ghash) {
                layer.msg('Please select a valid specification combination!', { icon: 2 });
                return;
            }

            const data = {
                ghash: ghash,
                number: 1, // Default quantity is 1
            };

			// Send AJAX request
			ajaxRequest('/add_cart', data, 'POST', this, function (response) {
				console.log(response)
				if (response.code == 1) {
					var cart_id = response.data
					window.location.href = '/order/'+cart_id;
				} else {
					layer.msg(response.message || 'Operation Failed!', { icon: 2 });
				}
			});
		});



</script>
{/block}
